<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div id="parent">
        <p>第一个子标签</p>
        <p id="second">第二个子标签</p>
        <p>第三个子标签</p>
    </div>

    <script>

        const second = document.querySelector("#second");
        // 1. 获取父标签
        const parent = second.parentElement;
        // console.log(parent);

        // 2. 获取第一个子标签
        const firstChild = parent.firstElementChild;
        // console.log(firstChild);
        // 3. 获取最后一个子标签
        const lastChild = parent.lastElementChild;
        // console.log(lastChild);
        // 4. 获取所有的子标签
        const allChild = parent.children;
        // console.log(allChild);

        // 5. 获取前一个兄弟标签
        const prev = second.previousElementSibling;
        console.log(prev);
        // 6. 获取后一个兄弟标签
        const next = second.nextElementSibling;
        console.log(next);
        



    </script>
</body>

</html>